import wxvalidate from 'wechat-validate'
Page({
  behaviors: [wxvalidate],
  data: {
    // 时间
    currentDate: Date.now(),
    houseLayerVisible: false,
    repairLayerVisible: false,
    dateLayerVisible: false,
    repairItemId: '',
    repairItemName: '',
    mobile: '',
    houseList: [],
    // 维修项目数组
    repairItem: [],
    // 与日前选择组件绑定
    appointment: '',
    // 图片数组
    attachment: [],
    // 问题描述
    description: '',
    houseId: '',
    houseInfo: '',
  },
  // 校验规则
  rules: {
    houseId: [{
      required: true,
      message: '请选择爆修房屋',
    }, ],
    repairItemId: [{
      required: true,
      message: '请选择爆修项目',
    }, ],
    mobile: [{
        required: true,
        message: '请输入手机号',
      },
      {
        pattern: /^1[3-8]\d{9}$/,
        message: '手机号格式错误',
      },
    ],
    appointment: [{
      required: true,
      message: '请选择维修日期',
    }, ],
    description: [{
      required: true,
      message: '请输入问题描述',
    }, ],
  },
  onLoad({
    id
  }) {
    this.getHouseList()
    this.getRepairItem()
    if (id) this.getDetail(id)
  },

  // 获取到用户选择的房屋
  selectHouseInfo(e) {
    this.setData({
      houseId: e.detail.id,
      houseInfo: e.detail.name,
    })
  },
  // 获取维修项目
  async getRepairItem() {
    const {
      code,
      data: repairItem
    } = await wx.http.get('/repairItem')
    if (code !== 10000) return wx.utils.toast()
    this.setData({
      repairItem,
    })
  },
  // 获取用户选择的维修项目
  selectRepairItemInfo(e) {
    this.setData({
      repairItemId: e.detail.id,
      repairItemName: e.detail.name,
    })
  },

  // 点击时间选择组件确认按钮触发的事件
  selectDateInfo(e) {
    // console.log(e)
    // 关闭弹出层
    this.setData({
      appointment: wx.utils.dataFormat(e.detail),
      dateLayerVisible: false,
    })
  },

  // 上传图片
  uploadPicture(e) {
    // console.log(e)
    const {
      file
    } = e.detail
    wx.uploadFile({
      url: wx.http.baseURL + '/upload',
      filePath: file.url,
      name: 'file',
      header: {
        Authorization: 'Bearer ' + getApp().token,
      },
      success: (res) => {
        const data = JSON.parse(res.data)
        if (data.code !== 10000) return wx.utils.toast()
        this.data.attachment.push(data.data)
        this.setData({
          attachment: this.data.attachment,
        })
      },
    })
  },

  // 删除图片
  delImg(e) {
    this.setData({
      attachment: this.data.attachment.filter((item) => item.id !== e.detail.file.id),
    })
  },
  openHouseLayer() {
    this.setData({
      houseLayerVisible: true,
    })
  },
  closeHouseLayer() {
    this.setData({
      houseLayerVisible: false,
    })
  },
  openRepairLayer() {
    this.setData({
      repairLayerVisible: true,
    })
  },
  closeRepairLayer() {
    this.setData({
      repairLayerVisible: false,
    })
  },

  openDateLayer() {
    this.setData({
      dateLayerVisible: true,
    })
  },
  closeDateLayer() {
    this.setData({
      dateLayerVisible: false,
    })
  },
  // 获取报修详情
  async getDetail(id) {
    if (!id) return
    const {
      code,
      data: repairDetail
    } = await wx.http.get(`/repair/${id}`)
    if (code !== 10000) return wx.utils.toast()
    this.setData(repairDetail)
  },
  async submitData() {
    if (!this.validate()) return
    // 解构调接口要的数据
    const {
      id,
      houseId,
      description,
      repairItemId,
      mobile,
      appointment,
      attachment
    } = this.data

    // 调接口
    const {
      code
    } = await wx.http.post('/repair', {
      id,
      houseId,
      description,
      repairItemId,
      mobile,
      appointment,
      attachment,
    })

    if (code !== 10000) return wx.utils.toast('在线保修失败')
    // 跳转到保修列表
    wx.redirectTo({
      url: '/repair_pkg/pages/list/index',
    })
  },

  // 获取房屋列表
  async getHouseList() {
    const {
      code,
      data: houseList
    } = await wx.http.get('/house')
    if (code !== 10000) return wx.utils.toast()
    this.setData({
      houseList,
    })
  },
})